import { Link } from '@brillout/docpress'
import { StaticHostDocIntro, StaticHostDocOutro, StaticHostDocStrategies } from '../../components/static-host'
import { Example, UseBati } from '../../components'

## Full-stack

The [vike-cloudflare](https://github.com/vikejs/vike-cloudflare) package enables zero-configuration deployment to [Cloudflare Pages](https://pages.cloudflare.com).

It will deploy prerendered routes as static files, and dynamic routes as [Pages Functions](https://developers.cloudflare.com/pages/functions/advanced-mode/).

> Instead of using `vike-cloudflare` you can manually integrate Cloudflare Pages yourself, see <Link href="/cloudflare-workers#cloudflare-pages" doNotInferSectionTitle={true} />.

<UseBati>Cloudflare Pages with `vike-cloudflare`</UseBati>

### Without a server

```js
// vite.config.js

import { pages } from "vike-cloudflare";

export default {
  plugins: [pages()]
}
```

### With a server

`vike-cloudflare` currently supports <Link href="/hono" /> and <Link href="/hattip" />

> <Link href="/hattip" /> also requires the installation of `@hattip/adapter-cloudflare-workers`

```js
// vite.config.js

import { pages } from "vike-cloudflare";

export default {
  plugins: [pages({
    server: {
      kind: "hono", // or "hattip"
      entry: "hono-entry.ts" // entrypoint of the server
    }
  })]
}
```

## Static

<StaticHostDocIntro
  staticHostLink={<>, such as <a href="https://pages.cloudflare.com/">Cloudflare Pages</a></>}
/>

<StaticHostDocStrategies name="Cloudflare Pages" />

If you let Cloudflare Pages build your app, note that Vike requires Node.js `>=12.19.0` and you may need to change <a href="https://developers.cloudflare.com/pages/platform/build-configuration#language-support-and-tools">Cloudflare Pages' default Node.js version</a>.

<StaticHostDocOutro />

## Examples

Example of using Vike with Cloudflare Pages with a Cloudflare worker:
 - <Example timestamp="2024.06" repo="vikejs/vike-cloudflare" /> - `vike-cloudflare` demos, with support for Plain Vike and Servers like <Link href="/hono" />.
 - <Example timestamp="2024.01" repo="travis-r6s/vike-cf-pages" /> - Advanced demo showcasing a lot of integrations such as REST, tRPC, GraphQL, Sentry, and Thumbprint.
 - <Example timestamp="2024.01" repo="osseonews/vike-app-cfp" />
 - <Example timestamp="2022.04" repo="Immortalin/vite-plugin-ssr-cloudflare-pages-demo" />
   > vite-plugin-ssr was the [previous name of Vike](https://vite-plugin-ssr.com/vike).
